
#include("./_inc/_layout.html")
#@layout("集成问答-共享",null,null,"jie")
#define content()
#include("./_inc/_enjoynavigation.html",cid='')
<script type="text/javascript" src="/static/js/zepto.min.js"></script>
<div class="container row center-block ">
</div>
<div class="layui-container">
  <div class="layui-row layui-col-space15">
    <div class="layui-col-md9">
        <div class="download_l fl" style="margin-top: 0px;">
          <div class="dl_wrap">
            <dl class="cate_sea_list clearfix">
              <dt>资源类型：</dt>
              <dd id="sourcetype">
                <input type="hidden" id="attachementCategoryId" value="#(attachementCategoryId)">
                <a bata-id="10" class="source_item js_source #(attachementCategoryId=='0'?'cate_cur':'') " href="/enjoy?attachementCategoryId=0">全部</a>
                <a bata-id="10" class="source_item js_source #(attachementCategoryId=='1'?'cate_cur':'') " href="/enjoy?attachementCategoryId=1">文档类</a>
                <a bata-id="10" class="source_item js_source #(attachementCategoryId=='2'?'cate_cur':'')"  href="/enjoy?attachementCategoryId=2">工具类</a>
                <a bata-id="10" class="source_item js_source #(attachementCategoryId=='3'?'cate_cur':'')"  href="/enjoy?attachementCategoryId=3">代码类</a>
                <a bata-id="10" class="source_item js_source #(attachementCategoryId=='4'?'cate_cur':'')"  href="/enjoy?attachementCategoryId=4">其他</a>

                <!--#for(attachementCategory : attachementCategorys )-->
                <!--<a bata-id="#(attachementCategory.id)" class="source_item js_source " href="/enjoy?attachementCategoryId=#(attachementCategory.id)">#(attachementCategory.name)</a>-->
                <!--#end-->
              </dd>
             <!-- <dd id="sourcetype">
                <a href="javascript:;" class="on">全部</a>
                <a href="javascript:;">文档类</a>
                <a href="javascript:;">工具类 </a>
                <a href="javascript:;">代码类</a>
                <a href="javascript:;">其他</a>
              </dd>-->
            </dl>

            <dl class="cate_sea_list clearfix">
              <dt class="keyword_dt">关键词：</dt>
              <form action="/enjoy" name="search-form" method="get" id="search-form-new" style="color:#C9C5C5;" class="search-form">
              <dd>
                <input class="hdi" id="postType" maxlength="256" tabindex="1" size="46" name="postType" value="#(postType)" type="hidden">
                <input type="text" class="keywords"  id="keyword" name="keyword" value="#(keyword)" onkeyup="KeyP(event);" placeholder="输入关键词" style="color: #999"><button  class="cate_search" >搜索</button>
              </dd>
              </form>
            </dl>
          </div>

          <div class="condition clearfix" style="display: none;"><span>已选条件 ： &nbsp;</span>
            <div class="condition_wrap">
              <label id="tech" class="condition_item"><em>全部</em></label>

              <label class="removeAll">
                <a href="javascript:;" class=""></a>
              </label>

            </div>
          </div>
        </div>
      <!--context start-->
      <div class="resouces_tab_shows tab_nav J_tabSwitch" style="margin-top: 0px;">
      <div class="tab_con_box">
        <!-- 代码资源列表-->
        <div class="tab_page tab3_con">
          <div class="album_detail_wrap" id="album_detail_wrap">
            <!-- 循环开始 -->
            <dl class="album_detail_list clearfix" style="padding-bottom: 0">
              #for(post : pageData.list)
              <dt style=" margin-bottom: 30px;">

                  <!--<div style="background:url(/static/images/right/zip.svg) no-repeat ;width:100px;height:50px">文字</div>-->

                <!--<a target="_blank" href="#"><img src="/static/images/right/zip.svg" alt="img"></a>-->
                <div style="position: relative; width: 42px; height: 48px;text-align: center;">
                  <img src="/static/images/right/zip.png" alt="img">
                  <span style="position: absolute; top: 15px;left: 12px;color:white;">#(post.userAttachment.attachment_type)</span>
                </div>
              </dt>
              <dd style="margin-bottom: 16px">
                <div>
                <h1 style="font-size: 22px">
                  <a href="/upload/#(post.id)"  style="color:#333">#(post.title)</a>
                </h1>
                <!--<a target="_blank" href="/upload/#(post.id)" class="album_detail_title">#(post.title)</a>-->
                  #if(post.content!=null&&post.content.length()<300)
                  <cite STYLE="COLOR:#666">资源描述：
                    <script type="text/javascript">

                        var s="#(post.content)";


                        var dd=s.replace(/<\/?.+?>/g,"");

                        var dds=dd.replace(/ /g,"");//dds为得到后的内容

                        document.write(dds);
                    </script>
                  </cite>
                  #end
                  #if(post.content!=null&&post.content.length()>=300)
                  <cite STYLE="COLOR:#666">资源描述：
                    <script type="text/javascript">

                        var s="#(post.content.substring(0, 300)).....";

                        var dd=s.replace(/<\/?.+?>/g,"");

                        var dds=dd.replace(/ /g,"");//dds为得到后的内容
                       document.write(dds.substring(0,80));
                    </script>
                   </cite>
                  #end
                  <br /><br />
                </div>
                <div class="album_detail_bot clearfix">
                  <label>
                    <span>上传者：</span>
                    <em class="upl_name">#(post.user.nickname)</em></label>
                  <label>
                    <span>上传类型：</span>
                    <em class="upl_name">#(post.attachmentCategory.name)</em></label>
                  <label>
                    <span>上传时间：</span>
                    <em class="upl_time">#(post.created)</em></label>
                  <strong>
                    <span class="jifen">下载次数：</span>
                    <em> #MyUploadCount(postId = post.id )
                         #(uploadCount)
                      #end
                    </em></strong>
                </div>
              </dd>
              #end
            </dl>


        </div>
          <!-- 循环结束 -->
          <!--<div id="get_more_code" class="js-load-more" style="font-size:14px; color:#0086cc; text-align:center;padding-top:10px;cursor: pointer;">点击加载更多</div></div>-->
          <div id="get_more_code" class="js-load-more" style="font-size:14px; color:#0086cc; text-align:center;padding-top:10px;cursor: pointer;"></div></div>
      </div>
        #include("./_inc/_pagination.html")
    </div>
    </div>
    <div class="layui-col-md3">

      #include("./_inc/_signin_panel.html")
      #if(USER!=null)
      #include("./_inc/_uploadrecommend.html")
      #end
      <!--#include("./_inc/_hot_posts.html")-->
      #include("./_inc/_hot_upload.html")
      <!--#include("./_inc/_links.html")-->
      #include("./_inc/_contact.html")

    </div>
  </div>
</div>
#end
#define script()
#end
<script>

    $(function(){

        /*初始化*/
        var counter = 0; /*计数器*/
        var pageStart = 2; /*offset*/
        var pageSize = 2; /*size*/
        var isEnd = false;/*结束标志*/
        /*首次加载*/
       //getData(pageStart, pageSize);

        /*监听加载更多*/
        $(document).on('click', '.js-load-more', function(){
            //counter ++;
            //pageStart = counter * pageSize;

            getData(pageStart, pageSize);
            ++pageStart;
        });
      /*监听加载更多*/
        $(window).scroll(function(){
            if(isEnd == true){
                return;
            }

            // 当滚动到最底部以上100像素时， 加载新内容
            // 核心代码
            if ($(document).height() - $(this).scrollTop() - $(this).height()<100){
                counter ++;
                pageStart = counter * pageSize;

                getData(pageStart, pageSize);
            }
        });
    });

    function getData(offset,size){
        var keyword=$('#keyword').val();
       var url = "/bufferEnjoy?page="+offset+"&attachementCategoryId="+$('#attachementCategoryId').val()+"&keyword="+keyword;
        $.ajax({
            type: 'GET',
            url: url,
            dataType: 'json',
            success: function(reponse){
                console.log(JSON.stringify(reponse));
                var data = reponse.list;
                //alert(data[0].attrs.comment_count);
                var sum = reponse.list.length;
                var result = '';

                /****业务逻辑块：实现拼接html内容并append到页面*********/

                //console.log(offset , size, sum);

              /*如果剩下的记录数不够分页，就让分页数取剩下的记录数
               * 例如分页数是5，只剩2条，则只取2条
               *
               */


              /*使用for循环模拟SQL里的limit(offset,size)*/
                for(var i=0; i< sum; i++){
//                    result +='<div class="weui_media_box weui_media_text">'+
//                        '<a href="'+ data[i].url +'" target="_blank"><h4 class="weui_media_title">'+ data[i].title +'</h4></a>'+
//                        '<p class="weui_media_desc">'+ data[i].desc +'</p>'+
//                        '</div>';
                    var myUploadCount;
                    $.ajax({
                        type: 'GET',
                        url: '/upload/myUploadCount?postId='+data[i].attrs.id,
                        dataType:'text',
                        async:false,
                        success: function (reponse) {
                            myUploadCount=reponse;
                        }
                    });
                    result +='<dl class="album_detail_list clearfix"><dt><div style="position: relative; width: 42px; height: 48px;text-align: center;">' +
                       '<img src="/static/images/right/zip.png" alt="img"><span style="position: absolute; top: 15px;left: 12px;color:white;">'
                        +data[i].attrs.userAttachment.attrs.attachment_type+'</span>' +
                        '</div>' +
                        '</dt><dd><a target="_blank" href="/upload/' + data[i].attrs.id+'" class="album_detail_title">'+data[i].attrs.title +'</a>' +
                        '<div class="album_detail_bot clearfix"><label><span>上传者：</span><em class="upl_name">'+data[i].attrs.user.attrs.nickname +'</em></label>' +
                        '<label><span>上传时间：</span><em class="upl_time">'+data[i].attrs.created +'</em></label>' +
                        '<strong><span class="jifen">下载次数：</span><em> '+myUploadCount+'</em></strong></div></dd></dl>'
                }

                $('#album_detail_wrap').append(result);

              /*******************************************/

              /*隐藏more按钮*/
                if ( sum==null||sum==""){
                    $(".js-load-more").hide();
                }else{
                    $(".js-load-more").show();
                }
            },
            error: function(xhr, type){

            }
        });
    }

    /*$(function(){
        $(" #sourcetype a").click(function(){
            $(this).addClass('on').siblings().removeClass('on');
            var index = $(this).index();


        });

    });*/
</script>

<style>
 /*.on{*/
      /*color:#c00; text-decoration:none;border-bottom: solid 2px #0086cc}*/
 /*#sourcetype a{ display:block; padding:6px 20px; float:left; text-decoration:none; color:#333;}*/
 .container{
   padding-right: 0px!important;
   padding-left: 0px!important;
 }
  .download_l {
    position: relative;
  }
  .download_l {
    width: 100%;
  }
  .fl {
    float: left;
  }
  .dl_wrap {
    padding: 10px 20px;
    overflow: hidden;
  }
  .dl_wrap {
    margin-bottom: 10px;
  }
  .dl_wrap {
    border: 1px solid #eee;
    background: #fff;
  }
  .cate_sea_list {
    padding: 10px 0;
    border-bottom: dashed 1px #e6e6e6;
    line-height: 20px;
  }
  .clearfix:before, .clearfix:after {
    display: table;
    content: " ";
  }
  dd, dl, dt {
    line-height: 1.2;
  }
  dd, dl, dt, label {
    font-weight: 400;
  }
  .cate_sea_list dt {
    width: 80px;
    float: left;
    font-size: 14px;
    color: #999;
  }
  .source_item:first-child {
    margin-left: 0;
  }
  .cate_sea_list .cate_cur, .cate_sea_list .sub_a:hover {
    color: #c00;
  }
  .source_item {
    margin-left: 20px;
    cursor: pointer;
    font-size: 14px;
    color: #546a7e;
  }
  .cate_search, .keywords, .source_item {
    display: inline-block;
    vertical-align: middle;
  }
  .cate_sea_list dd .cate_cur a {
    color: #c00;
  }
  .btn:focus, .btn:hover, a, a:active, a:hover, avisited {
    color: #333;
    text-decoration: none;
  }
  .clearfix:after {
    display: block;
    width: 0;
    height: 0;
    content: ".";
    clear: both;
    visibility: hidden;
  }
  .cate_sea_list:last-child {
    border-bottom: none;
    padding-bottom: 0;
  }
  .cate_sea_list {
    padding: 10px 0;
    border-bottom: dashed 1px #e6e6e6;
    line-height: 20px;
  }
  .cate_sea_list .keyword_dt, .cate_search, .keywords {
    line-height: 28px;
  }
  dd, dl, dt, form, li, ol, ul {
    list-style: none;
    margin: 0;
    padding: 0;
  }
  .keywords, .source_item {
    display: inline-block;
    vertical-align: middle;
  }
  .keywords {
    background: #f7f8f9;
    border: 1px solid #eee;
  }
  .cate_search {
    padding: 0 30px;
    height: 28px;
    background: #0086cc;
    font-size: 14px;
    color: #fff;
    border: none 0;
    border-color: #0086cc;
    /*border-radius: 20px;*/
  }

  /*context*/
  .tab_con_box .tab_page {
    padding: 10px 19px 9px;
  }
  .album_detail_wrap .album_detail_list {
    padding: 15px 0;
    /*border-bottom: dashed 1px #e6e6e6;*/
  }
  .clearfix:before, .clearfix:after {
    display: table;
    content: " ";
  }
  .album_detail_wrap .album_detail_list dt {
    width: 45px;
    float: left;
  }
  .album_detail_wrap .album_detail_list dt img {
    width: 42px;
    height: 48px;
  }
  .album_detail_wrap .album_detail_list dd {
    margin-left: 60px;
  }
  .album_detail_wrap .album_detail_list dd .album_detail_title {
    display: inline-block;
    padding-bottom: 20px;
    font-size: 16px;
    color: #333;
    font-weight: 700;
    width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
  }
  album_detail_wrap .album_detail_list dd .album_detail_bot {
    font-size: 0;
  }
  resouces_tab_shows .album_detail_wrap .album_detail_list .album_detail_bot {
    position: relative;
  }
  .album_detail_wrap .album_detail_list dd .album_detail_bot label:first-child {
    margin-left: 0;
  }
  .album_detail_wrap .album_detail_list dd .album_detail_bot label, .album_detail_wrap .album_detail_list dd .album_detail_bot strong {
    display: inline-block;
    vertical-align: middle;
    font-size: 12px;
  }
  dd, dl, dt, label {
    font-weight: 400;
  }
  album_detail_wrap .album_detail_list dd .album_detail_bot label .jifen, .album_detail_wrap .album_detail_list dd .album_detail_bot label .upl_time {
    color: #959db1;
  }
  .iconfont, em, i {
    font-style: normal;
  }
  /*.resouces_tab_shows .album_detail_wrap .album_detail_list .album_detail_bot strong {*/
    /*display: block;*/
    /*position: absolute;*/
    /*right: 0;*/
    /*bottom: 0;*/
  /*}*/
  .album_detail_wrap .album_detail_list dd .album_detail_bot strong {
    float: right;
    text-align: right;
    font-weight: 400;
  }
  .resouces_tab_shows .album_detail_wrap .album_detail_list .album_detail_bot strong em {
    position: relative;
    vertical-align: baseline;
  }
  .album_detail_list dd .album_detail_bot strong em {
    vertical-align: middle;
    display: inline-block;
    position: absolute;
    right: 0;
    bottom: -2px;
    color: #ff9358;
    font-size: 32px;
    line-height: 32px;
  }
  .album_detail_list dd .album_detail_bot strong span {
    color: #888;
    vertical-align: middle;
  }
  .resouces_tab_shows {
    margin-top: 20px;
    margin-bottom: 10px;
    width: 100%;
    border: 1px solid #eee;
    border-top: none;
    background-color: #fff;
  }
  .keywords {
    width: 616px;
    height: 28px;
    padding: 0 10px;
    margin-right: 0px;
  }
 a.cate_search:hover {
   color: #fff!important;
   text-decoration: underline;
 }
</style>
